.shadow {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

/* Dark mode colors. */
:root {
    --sl-color-accent-low: #3a1814;
    --sl-color-accent: #b5372b;
    --sl-color-accent-high: #eabcb4;
    --sl-color-white: #ffffff;
    --sl-color-gray-1: #f3ecea;
    --sl-color-gray-2: #c8c0be;
    --sl-color-gray-3: #978784;
    --sl-color-gray-4: #635451;
    --sl-color-gray-5: #423432;
    --sl-color-gray-6: #302321;
    --sl-color-black: #1d1715;
}
/* Light mode colors. */
:root[data-theme='light'] {
    --sl-color-accent-low: #f1cdc7;
    --sl-color-accent: #b73a2d;
    --sl-color-accent-high: #541f18;
    --sl-color-white: #1d1715;
    --sl-color-gray-1: #302321;
    --sl-color-gray-2: #423432;
    --sl-color-gray-3: #635451;
    --sl-color-gray-4: #978784;
    --sl-color-gray-5: #c8c0be;
    --sl-color-gray-6: #f3ecea;
    --sl-color-gray-7: #f9f5f5;
    --sl-color-black: #ffffff;
}